← snapshot

import { IdChip } from "@/components/id-chip";
import { api } from "@/lib/api";
import { BranchForm } from "./branch-form";

export const dynamic = "force-dynamic";

export default async function RefsPage({
  params,
}: {
  params: Promise<{ repo: string }>;
}) {
  const { repo } = await params;
  const detail = await api.repo(repo);

  return (
    <div style={{ maxWidth: 780 }}>
      <p className="jac-eyebrow">The mutable edge of an immutable DAG</p>
      <h1 className="jac-h1">Refs</h1>
      <ul className="jac-rows" style={{ marginTop: 16 }}>
        {detail.refs.map((r) => (
          <li key={r.name} className="jac-row">
            <span className="jac-pill">{r.name}</span>
            <IdChip id={r.head} kind="snap" href={`/repos/${repo}/snapshots/${r.head}`} />
            {r.name === detail.default_ref ? (
              <span className="jac-small">default — promotions land here, gated</span>
            ) : null}
          </li>
        ))}
      </ul>
      <hr className="jac-divider" />
      <p className="jac-eyebrow">start a new thread</p>
      <p className="jac-small" style={{ marginTop: 8 }}>
        Branching is ungated by design: it is how work starts. The gate stands
        at promotion.
      </p>
      <BranchForm repo={repo} refNames={detail.refs.map((r) => r.name)} />
    </div>
  );
}